import React from 'react';
import { Carousel } from 'antd';

interface imgsitme {
    img?: string,
    title?: string
}

function Libs({ height, imgs }: any) {

    return (
        <div>
            {/* 轮播图复用 */}
            <Carousel speed={500} arrows infinite={true} dots={false} autoplay effect="fade" >
                {
                    imgs && imgs.map((item: imgsitme, index: number) => {
                        return <div key={index}>
                            <img src={item.img} alt="" style={{ width: '100%', height: height, borderRadius: '7px' }} />
                            <h3 style={{
                                position: 'absolute',
                                left: '50%',
                                transform: 'translateX(-50%)',
                                top: '8%',
                                color: '#fff',
                                fontSize: '32px'
                            }}>{item.title}</h3>
                        </div>
                    })
                }
            </Carousel>
        </div>
    )
}

export default Libs
